<template>
  <div px-30rpx v-if="res">
    <div v-if="res.isShowTitle == 1" text-42rpx mt-40rpx break-all font-800 line-height-60rpx>
      {{ res.title }}
    </div>
    <div v-if="res.isShowPublishTime == 1" text-24rpx flex items-center mt-20rpx font-400 mb-20rpx>
      <span v-if="!!res.source" mr-40rpx>{{ res.source }}</span>
      <span>{{ res.publishTime }}</span>
    </div>
    <!-- <div class="rich-text" mt-40rpx pb-30 v-html="richText"></div> -->
    <mp-html :content="richText" />
  </div>
  <back></back>
</template>

<script setup lang="ts">
import { getArticleDetail } from '@/api/decoration'
import { onLoad } from '@dcloudio/uni-app'
const res = ref<any>(null)

const richText = computed(() => {
  return res.value.content
    .replace(/<img /g, '<img style="max-width:100%;height:auto;display:block;" ')
    .replace(/<video /g, '<video style="width: 100%;max-width:100%;height:auto;display:block;" ')
})

onLoad(async (option: any) => {
  let contentId = ''
  if (option.scene) {
    const scene = decodeURIComponent(option.scene)
    option.contentId = scene
  }
  if (option.contentId) {
    contentId = option.contentId
  }
  if (contentId) {
    const response = await getArticleDetail(contentId)
    if (!response.data?.result) {
      uni.showToast({
        title: '文章不存在',
        icon: 'none'
      })
      return
    }
    res.value = response.data?.result
    uni.setNavigationBarTitle({
      title: res.value.title
    })
  } else {
    uni.showToast({
      title: '文章不存在',
      icon: 'none'
    })
  }
  
  
})
</script>
<style>
page {
  background-color: #fff;
}
</style>
<style scoped></style>
